<template>
  <div class="container">
    <h1>父组件</h1>
    <p>{{ money }}</p>
    <button @click="money += 1000">点击加钱</button>
    <hr />
    <!-- 🔔 Vue2 的 v-model 语法糖由  :value 属性 + @input 事件构成 -->
    <!-- 🔔 Vue3 的 v-model 语法糖由  :modelValue 属性 + @update:modelValue 事件构成 -->
    <Son @update:modelValue="money = $event" :modelValue="money" />
    <Son v-model="money" />
  </div>
</template>

<script>
import { ref } from 'vue'
// 引入组件
import Son from './components/Son.vue'
export default {
  components: { Son },
  setup() {
    const money = ref(10000)
    return { money }
  },
}
</script>
